* {
  margin: 0;
  padding: 0;
  justify-content: space-evenly;
}

// 批量生成flex工具类样式
$flex: (
  "flex": flex,
);

@each $flexkey, $flexvalue in $flex {
  .c-#{$flexkey} {
    display: $flexvalue;
  }
}

$flexdirection: (
  "flex-row": row,
  "flex-row-reverse": row-reverse,
  "flex-column": column,
  "flex-column-reverse": column-reverse,
);

@each $flexdkey, $flexdvalue in $flexdirection {
  .c-#{$flexdkey} {
    flex-direction: $flexdvalue;
  }
}

$justifycontent: (
  "justify-start": start,
  "justify-end": end,
  "justify-center": center,
  "justify-space-between": space-between,
  "justify-space-around": space-around,
  "justify-space-evenly": space-evenly,
);

@each $flexjkey, $flexjvalue in $justifycontent {
  .c-#{$flexjkey} {
    justify-content: $flexjvalue;
  }
}

// 圆角
$borderRadius: (
  "rounded-0": 0,
  "rounded-sm": 4px,
  "rounded": 6px,
  "rounded-lg": 10px,
  "rounded-xl": 12px,
  "rounded-pill": 15px,
  "rounded-circle": 50%,
);

@each $borderRadiuskey, $borderRadiusvalue in $borderRadius {
  .c-#{$borderRadiuskey} {
    border-radius: $borderRadiusvalue;
  }
}

.c-font {
  font-size: 24px;
  height: 24px;
  line-height: 24px;
}
